<template>
	<view class="center">
		<view style="margin-top: 10px;">
			<uni-card title="个人资料">
				<view class="uni-body">
					<uni-list>
						<uni-list-item>
							<template v-slot:body>
							<text class="slot-box slot-text">头像</text>
							</template>
							<template v-slot:footer>
								<image class="slot-image" :src="userData.photo" mode="widthFix"></image>
							</template>
						</uni-list-item>
						<uni-list-item title="姓名" :rightText="userData.name" />
						<!-- <uni-list-item title="电话" :rightText="userData.phone" /> -->
					</uni-list>
				</view>
			</uni-card>
		</view>
		<view style="margin-top: 10px;">
			<uni-card title="岗位信息">
				<view class="uni-body">
					<uni-list>
						<uni-list-item title="工号" :rightText="userData.number" />
						<uni-list-item title="职位" :rightText="userData.position" />
						<uni-list-item title="所属车间" :rightText="userData.workshop" />
						<uni-list-item title="所属车间区域" :rightText="userData.workshoparea" />
					</uni-list>
				</view>
			</uni-card>
		</view>
	</view>
</template>

<script>
	import { post, postForm } from '../../utils/request.js';
	export default {
		data() {
			return {
				extraIcon: {
					color: '#4cd964',
					size: '22',
					type: 'gear-filled'
				},
				hasLogin: true,
				ucenterList: [
					{
						"title": "个人中心",
						"to": '',
						"icon": "help"
					},
					{
						"title": "关于我们",
						"to": '',
						"icon": "help"
					}, 
					{
						"title": "意见反馈",
						"to": '',
						"icon": "help"
					},
					{
						"title": "设置",
						"to": '',
						"icon": "gear"
					},
					{
						"title": "退出登录",
						"to": '',
						"icon": "help"
					},
				],
				title: '',
                searchQuery: '', // 用户的搜索输入
				userData: {
					name: 'test'
				},
				value: '',
				userInfor: uni.getStorageSync('userInfor'),
                range: [
                    { value: 0, text: "1" },
					{ value: 1, text: "2" },
					{ value: 2, text: "3" },
				],
				current: 3,
				total: 10,
				pageSize: 10,
				FormData: {
					name: '',
					code: '',
					pass: ''
				},
				infoData: [],
				single:  new Date(),
				mediaType: ['image', 'audio']
			}
		},
		onLoad() {
			this.getData()
		},
		methods: {
			clickInter(){
				
			},
			getData() {
				postForm('/user/selectById', {id: this.userInfor.userId} )
				    .then(data => {
						if(data.code == 200) {
							this.userData = data.data
						} else {
							  uni.showToast({
							    icon: 'none',
							    title: data.message
							  });
						}
				    })
				    .catch(err => {
				        uni.showToast({
				           icon: 'none',
				          title: '获取数据失败，请检查接口返回'
				        });
				    });
			},
			//搜索功能
			  onSearch() {
			    // 执行搜索逻辑，比如发送请求到服务器或者过滤本地数据
			    console.log('搜索内容:', this.searchQuery);
			    // 这里可以添加实际的搜索逻辑，比如调用API或者过滤数据列表
			  },
			  viewInfor() {
				  uni.redirectTo({
				      url: '/pages/position/posAll/viewInfor' // 跳转页面的路径
				  });
			  },
		    change(e) {
				this.single = e
				console.log('change事件:', this.single = e);
						},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			maskClick(e){
				console.log('maskClick事件:', e);
			}
		}
	}
</script>

<style>
	.slot-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
	}
	
	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 30px;
		height: 30px;
	}
	.slot-text {
		flex: 1;
		font-size: 14px;
		color: black;
		margin-right: 10px;
	}
	.center {
		flex: 1;
		flex-direction: column;
		background-color: #f8f8f8;
	}
</style>
